iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 5
0
自我挑戰組

溫故知新 JavaScript系列 第 5

Day5- 你一定要認識的變數

  • 分享至 

  • xImage
  •  

https://ithelp.ithome.com.tw/upload/images/20200918/20129439DdytP90iR7.jpg
人類一早起床看到的所有東西都會存放在我們腦海裡,我們會對看到的東西有印象,但是電腦可不同我們得告訴它需要記住什麼,把我們要電腦記住的東西存起來,在後面程式運作時才可以隨時調用。

變數的寫法是這樣的

var milkprice = 60;

解釋上面的語法

先用 var 當開頭就等於是宣告一個變數,此時電腦就會空出一個記憶體空間去存放這個變數,後面接著替變數取一個名稱 milkprice 在把 60 這個數字放進去,所以 milkprice 就等於 60。

記得變數的結尾要加分號 ; 電腦才知道這段程式碼結束,雖然沒有加瀏覽器也會自動補上但從一開始寫程式就養成良好的習慣是很重要的。

資料型態

變數的資料型態不是只能放數字也還能放下面這些型態。

數字、字串、布林值、物件、空值

//number 數字
123  
                                        
//string 字串
'Hello' 

// boolean 布林
true,false 

//object 物件
 { name: 'Jack' }、[1, 2, 3]、function foo() 、{ ... }          
//空值
null

來感覺一下變數

推薦大家可以去註冊 CodePen 這樣就可以快速地去驗證自己的程式跑出來的效果如何,我們可以在 js 區塊輸入以下程式碼

var milkprice = 60;
alert(milkprice);

milkprice = 30;
alert(milkprice);

前面有提過 alert 是彈跳視窗的函數,在 alert 內放入變數的名稱就會彈跳出 60,但我們也能夠再度變更變數裡面的數值,就是在取一個一模一樣的名稱,不用在 var 一次,直接放進新的值所以最後 milkprice 就會變成等於 30 了。

程式碼範例
今天就簡單分享變數的意思,下一篇就把之前提到的更動網頁內容與變數做一個整合吧!

如果使用 alert 函式要檢查就會跳出視窗還要按掉很擾人,可以使用 CodePen下面的 Console 去做觀察也是可以的。


上一篇
Day4- 透過 JS 去更動網頁內容
下一篇
Day6- 透過變數來體會程式的感覺吧!
系列文
溫故知新 JavaScript30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言